<template>
  <div id="importSuccessDialog">
    <el-dialog title="系统提示" :visible.sync="dialogData.isShow" width="450px">
      <div class="content">
        成功导入{{ dialogData.successText.successNum }}条数据，失败{{
          dialogData.successText.failNum
        }}条数据
      </div>
      <el-button
        type="info"
        :loading="loading"
        @click="downloadData"
        v-if="dialogData.successText.failNum"
        class="faliDataBtn"
      >
        下载失败数据
      </el-button>
      <span slot="footer" class="dialog-footer">
        <el-button type="success" @click="confirm">确认</el-button>
      </span>
    </el-dialog>
  </div>
</template>
<script>
export default {
  props: {
    dialogData: {
      type: Object,
      default: function() {
        return {
          isShow: false, // 显示隐藏
          successText: { successNum: 0, failNum: 0 }
        }
      }
    }
  },
  data() {
    return {
      loading: false
    }
  },
  methods: {
    /* 下载失败数据 */
    downloadData() {
      this.loading = true
      let url = this.dialogData.failDataUrl()
      this.downFile('get', url, {}, '导入京东E卡错误数据')
      this.loading = false
    },
    confirm() {
      this.loading = false
      this.dialogData.isShow = false
    }
  }
}
</script>
<style lang="less" scoped>
.content {
  text-align: center;
  font-size: 18px;
  margin-bottom: 20px;
}
.faliDataBtn {
  width: 106px;
  display: block;
  margin: 0 auto 25px;
}
</style>
